<%--
  Created by IntelliJ IDEA.
  User: 风间琉璃
  Date: 2021/9/3
  Time: 14:53
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
  <head>
    <title>在线通讯录</title>
  </head>
  <body>
      <h3>在线通讯录</h3>
      <form action="${pageContext.request.contextPath}/contact/list" method="post">
        <label>查找联系人：</label>
        <label>
          <input type="text" name="cname" value="${cname}"/>
        </label>
        <button type="submit">查找</button>
      </form>
  <a href="${pageContext.request.contextPath}/add.jsp">添加联系人</a>
      <div class="list-view">
          <c:if test="${list.size() == 0}">
                <h1>没有找到与“${cname}”相关的联系人！</h1>
          </c:if>
          <c:if test="${list.size() > 0}">

              <table>
                  <tr>
                      <th>序号</th>
                      <th>姓名</th>
                      <th>手机</th>
                      <th>QQ</th>
                      <th>Email</th>
                      <th>地址</th>
                      <th>操作</th>
                  </tr>
                  <c:forEach items="${list}" var="contact" varStatus="s">
                      <tr>
                          <td>${contact.id}</td>
                          <td><a href="${pageContext.request.contextPath}/contact/${contact.id}/getContact">${contact.cname}</a></td>
                          <td>${contact.mobile}</td>
                          <td>${contact.qq}</td>
                          <td>${contact.email}</td>
                          <td>${contact.address}</td>
                          <td><label><input type="button" class="del" delId="${contact.id}" value="删除"/></label></td>
                      </tr>
                  </c:forEach>
              </table>
              <a href="${pageContext.request.contextPath}/contact/list?pageIndex=1">首页</a>
              <c:if test="${pageIndex > 1}"><a href="${pageContext.request.contextPath}/contact/list?pageIndex=${pageIndex - 1}">上一页</a></c:if>
              <c:if test="${pageIndex < pageCount}"><a href="${pageContext.request.contextPath}/contact/list?pageIndex=${pageIndex + 1}">下一页</a></c:if>
              <a href="${pageContext.request.contextPath}/contact/list?pageIndex=${pageCount}">末页</a>
              <label>第${pageIndex}页/共${pageCount}页</label>
          </c:if>
      </div>
      <br/>
      <span class="msg">${msg}</span>
      <script src="${pageContext.request.contextPath }/statics/js/jquery-1.8.3.js">
      </script>
      <script>
          $(document).ready(function (){
              var msg = $(".msg");
              setTimeout(function (){
                  msg.hide();
              },3000);
              $(".del").click(function (){
                  var id = $(this).attr("delid");
                  var node = $(this).parent().parent().parent();
                  $.get("${pageContext.request.contextPath}/contact/del",{id:id},function (data){
                      if (data === 1){
                            alert("删除成功！");
                            node.remove();
                      }else {
                            alert("删除失败！");
                      }
                  })
              })
          })
      </script>
  </body>
</html>
